<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>列表</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>
    <script type="text/javascript" src="../../script/common.js"></script>
</head>
<body>
<div id="blank" class="header">
    <div v-back.tapmode class="back"></div>
    <span class="title" style="margin-left: 30px;">订单详情</span>
</div>
<div id="app" class="order-detail-body" v-cloak>
    <div class="order-item">
        <div class="order-top">
            <p v-if="getOrderById.state==1">待确认</p>
            <p v-if="getOrderById.state==2">已付款</p>
            <p v-if="getOrderById.state==3">已收货</p>
            <p v-if="getOrderById.state==4">已失效</p>
        </div>
        <div class="item-goods">
            <div class="order-body">
                <div class="order-left">
                    <span class="seller" :style="{background:getOrderById.from_type_color}">{{getOrderById.from_type_name}}</span>
                    <img v-image-resize="{src:getOrderById.goods[0].pic}">
                </div>
                <div class="order-middle">
                    <p>{{getOrderById.goods[0].title}}</p>
                </div>
                <div class="order-bottom">
                    <p class="p-first">￥{{getOrderById.goods[0].total_real_pay_fee}}</p>
                    <p class="p-second">×{{getOrderById.goods[0].quantity}}</p>
                    <p class="p-third">￥{{getOrderById.total_real_pay_fee}}</p>
                </div>
            </div>
        </div>
        <div class="item-price">
            <p class="p-1st"><span>原价</span><span>￥{{getOrderById.goods[0].total_real_pay_fee}}</span></p>
            <p class="p-2nd"><span>劵后价</span><span>￥{{getOrderById.goods[0].total_real_pay_fee}}</span></p>
            <p class="p-3rd"><span>实付款</span><span>￥{{getOrderById.total_real_pay_fee}}</span></p>
            <p class="p-4th" v-myclick="[getOrderById.goods[0].goods_id, openDetail]"><span>前往淘宝查看商品详情</span><img
                    v-src="'../../image/arrow_right_grey.png'"/></p>
        </div>
        <div class="item-bottom">
            <p>订单号：{{getOrderById.order_sn}}</p>
            <p>下单时间：{{getOrderById.date_add | time}}</p>
        </div>
    </div>
</div>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/common.js"></script>
<script type="text/javascript ">
    var vm;
    var getOrderById;
    var webBrowser;
    apiready = function () {
        setBSImg();
        new Vue({
            el:'#blank'
        });
        webBrowser = api.require('webBrowser');
        var data = {
            member_id: api.getPrefs({key: 'member_id', sync: true}),
            order_id: api.pageParam.order_id
        };
        var callback = function (ret) {
            if (ret.errcode == 0) {
                getOrderById = ret.content;
            }
            initApp();
            api.parseTapmode();
        };
        pinet.post(URL.getOrderById, data, callback);
        addListeners();

    };
    function initApp() {
        vm = new Vue({
            el: "#app",
            data: {
                getOrderById: getOrderById,
            },
            methods: {
                openDetail: function (id) {
                    openWin('../home/browser', {goods_id: id});
                }
            }
        });
    }

    function addListeners() {
        api.addEventListener({
            name: 'viewappear'
        }, function () {
            onPageStart();
        });

        api.addEventListener({
            name: 'viewdisappear'
        }, function (ret, err) {
            onPageEnd();
        });

        api.addEventListener({
            name: 'keyback'
        }, function (ret, err) {
            onPageEnd();
            api.closeWin();
        });
    }
</script>
</body>
</html>
